import { Suspense } from "react";

// 定义一个高阶组件，用于异步加载组件
export default function loadable(Component) {
  // 返回一个函数组件，接收传递给异步组件的props
  return function (props) {
    return (
      // 使用Suspense组件包裹异步加载的组件，提供加载中的UI反馈
      <Suspense fallback={<div>loading....</div>}>
        {/* 渲染异步加载的组件，并传递props */}
        <Component {...props} />
      </Suspense>
    );
  };
}